import { Tag } from 'antd';
import { useMemo, useState } from 'react';
import { CarOptions, CostOptions, DealOptions, ReceiveOptions, } from '@/pages/order/Order.data';

type CountType = {
  count: number;
  actualCount: number;
};

function getDefaultOptionData( options: any[] ) {
  return options.reduce(
    ( a, b ) => {
      a[b.key] = b.value;
      return a;
    },
    {} as any,
  );
}

function getCountData( options: any[], optionData: any ) {
  let count = 0,
    actualCount = 0;
  options.forEach(( m ) => {
    if (optionData[m.key]) {
      if (m.type === undefined) {
        count += optionData[m.key];
      }
      else if (m.type === -1) {
        actualCount -= optionData[m.key];
      }
      else if (m.type === -2) {
        count -= optionData[m.key];
      }
    }
  });
  return {count, actualCount};
}

export type DataOptionType = {
  optionData: any;
  setOptionData: ( data: any ) => void;
  title: React.ReactNode;
  label: string;
  options: any[];
  total: {
    count: number;
    actualCount: number;
  };
};

// 应付费用
export const useDealData = (): DataOptionType => {
  const label = '应付费用';
  const options = useMemo(() => DealOptions, []);
  const defaultOptionData = getDefaultOptionData(options);
  const [optionData, setOptionData] = useState(defaultOptionData);

  const total = useMemo(() => {
    const {count, actualCount} = getCountData(options, optionData);
    return {count, actualCount: actualCount + count};
  }, [optionData]);

  const title = useMemo(
    () => (
      <div className={'inline-flex title'}>
        <span>{label}</span>
        <div className={'ml-4'}>
          <span className={'text-xs'}>合计：</span>
          <Tag color="red">应付: {total.count}</Tag>
          <Tag color="volcano">实付: {total.actualCount}</Tag>
        </div>
      </div>
    ),
    [total.count, total.actualCount],
  );

  return {
    optionData,
    setOptionData,
    title,
    label,
    options,
    total,
  };
};

// 应收费用
export const useReceiveData = (
  dealCount: CountType,
  carCount: CountType,
  costNumber: CountType,
) => {
  const label = '应收费用';
  const options = useMemo(() => ReceiveOptions, []);
  const [optionData, setOptionData] = useState(getDefaultOptionData(options));

  const total = useMemo(() => {
    const {count, actualCount} = getCountData(options, optionData);
    return {count, actualCount: actualCount + count};
  }, [optionData]);

  const restMoney = useMemo(
    () =>
      (
        total.count -
        dealCount.count -
        carCount.count -
        costNumber.count
      ).toFixed(2),
    [total.count, dealCount.count, carCount.count, costNumber.count],
  );

  const title = useMemo(
    () => (
      <div className={'inline-flex title'}>
        <span>{label}</span>
        <div className={'ml-4'}>
          <span className={'text-xs'}>合计：</span>
          <Tag color="red">应收: {total.count}</Tag>
          <Tag color="volcano">实收: {total.actualCount}</Tag>
          <Tag color="green">毛利: {restMoney}</Tag>
          <Tag color="blue">车辆利润: {restMoney}</Tag>
        </div>
      </div>
    ),
    [total.count, total.actualCount, restMoney],
  );

  return {
    optionData,
    setOptionData,
    title,
    label,
    options,
    total,
  };
};


// 车辆费用
export const useCartData = () => {
  const label = '车辆费用';

  const options = useMemo(() => CarOptions, []);
  const [optionData, setOptionData] = useState(getDefaultOptionData(options));

  const total = useMemo(() => {
    const {count, actualCount} = getCountData(options, optionData);
    return {count, actualCount: actualCount + count};
  }, [optionData]);

  const title = useMemo(
    () => (
      <div className={'inline-flex title'}>
        <span>{label}</span>
        <div className={'ml-4'}>
          <span className={'text-xs'}>合计：</span>
          <Tag color="red">车辆应付: {total.count}</Tag>
          <Tag color="volcano">车辆实付: {total.actualCount}</Tag>
        </div>
      </div>
    ),
    [total.count, total.actualCount],
  );

  return {
    optionData,
    setOptionData,
    title,
    label,
    options,
    total,
  };
};

// 成本费用
export const useCostData = () => {
  const label = '成本费用';
  const options = CostOptions;
  const defaultOptionData = getDefaultOptionData(options);

  const [optionData, setOptionData] = useState(defaultOptionData);

  const total = useMemo(() => {
    const {count, actualCount} = getCountData(options, optionData);
    return {count, actualCount: actualCount + count};
  }, [optionData, options]);

  const title = useMemo(
    () => (
      <div className={'inline-flex title'}>
        <span>{label}</span>
        <div className={'ml-4'}>
          <span className={'text-xs'}>合计：</span>
          <Tag color="green">成本: {total.count}</Tag>
        </div>
      </div>
    ),
    [total.count, total.actualCount],
  );

  return {
    optionData,
    setOptionData,
    title,
    label,
    options,
    total,
  };
};
